import React, { useReducer } from 'react';
import ReactDOM from 'react-dom';
function reducer(state, action) {
  // 函数的返回值 既是新的数据源

  if (action.type == 'add') {
    return {
      ...state,
      count: state.count + action.n
    }
  } else if (action.type == 'changename') {
    return {
      ...state,
      name: action.newName
    }
  } else {
    return state
  }
  // return state
}
function App() {
  let [state, dispatch] = useReducer(reducer, {
    name: "zhufneg",
    count: 100
  })
  let { name, count } = state;

  return <>
    <h1>{count} {name}</h1>
    <button onClick={() => { dispatch({ type: 'add', n: 12 }) }}>+数字</button>
    <button onClick={() => { dispatch({ type: "changename", newName: "珠峰" }) }}>+改名字</button>
  </>
}

ReactDOM.render(<App />, document.getElementById('root'))